define(['text!/sscs/sscs.html', 'css!/sscs/css/sscs.css'],function (html) {


	function loadData() {

		$.get('./common/sscs.json', function (data) {			
			// console.log(data);
// 给左边请求并添加数据-------------------------------------
		 	data.data.categories.forEach(function little(iterms){		 		
				$(`
					<li>${ iterms.id }</li>
				`).appendTo('#left_ul');	
				
			});

			data.data.products[104749].forEach(function (iterms) {
					$(`
						<figure>
							<img src="${ iterms.img}" alt="">
							<span class="add">+</span>
							<figcaption>
								<h3>${ iterms.name }</h3>
								<span>精选</span>
								<p>买一赠一</p>
								<p>${ iterms.specifics }</p>
								<p>￥${ iterms.price }</p>
							</figcaption>
						</figure>
					`).appendTo('#right');
			});
// 给左边添加事件----------------------------------------
			$('#left_ul li').on('touchstart', function (e) {

				// 每次点击时先清空-----------
				$('#right').empty();

				// 找到对应id的数组----------------
				data.data.products[$(this).html()].forEach(function (iterms) {
					// console.log(iterms);
					$(`
						<figure>
							<img src="${ iterms.img}" alt="">
							<span class="add">+</span>
							<figcaption>
								<h3>${ iterms.name }</h3>
								<span>精选</span>
								<p>买一赠一</p>
								<p>${ iterms.specifics }</p>
								<p>￥${ iterms.price }</p>
							</figcaption>
						</figure>
					`).appendTo('#right');

				})
		 	});

			// 给+添加事件------------------------



		})


	};



	return {
		init: function () {
			 	$("#content").html(html);
                $('#header').load('./common/header.html');
                loadData();

		}






	}

})